<template>
    <div>
        <h1>前端技术</h1>
        <article-item :data="articles"/>
        <page-split :data="pageData"/>
    </div>
</template>

<script>
	import ArticleItem from '@/components/pagecomponents/ArticleItem';
	import PageSplit from '@/components/pagecomponents/PageSplit';
	export default {
		name: "page",
		components:{
			ArticleItem,
            PageSplit
		},
        validate({params}){
			return /^\d+$/.test(params.page);
        },
		async asyncData({app,route,params,redirect}){
			let page = params.page?params.page - 0:1;
			let result = await app.$getWebPage({page,num:10});
			let totalPage = Math.ceil(result.data.totals / 10);
			if(page > totalPage){
				redirect('/error')
			}
			return {
				articles:result.data.articleList,
                pageData:{
	                baseUrl:'/webpage',
					page,
	                totals:result.data.totals,
	                totalPage,
                }
			}
		}
	}
</script>

<style scoped>
    h1{
        display: none;
    }
</style>